// Check answer for question 2
var q2Answer = document.querySelector('input[name="q2"]:checked');
if (q2Answer && q2Answer.value === 'open') {
score++;
}
lab = document.getElementById('q2-a1');
showAnswerDetail('q2-open-detail');
lab.style.color = 'lightgreen';
lab = document.getElementById('q2-a2');
showAnswerDetail('q2-grammar-detail');
lab.style.color = 'red';
lab = document.getElementById('q2-a3');
showAnswerDetail('q2-verify-detail');
lab.style.color = 'red';
lab = document.getElementById('q2-a4');
showAnswerDetail('q2-ignore-detail');
lab.style.color = 'red';
var q3Answer = document.querySelector('input[name="q3"]:checked');
if (q3Answer && q3Answer.value === 'true') {
score++;
}
lab = document.getElementById('q3-a1');
showAnswerDetail('q3-true-detail');
lab.style.color = 'lightgreen';
lab = document.getElementById('q3-a2');
showAnswerDetail('q3-false-detail');
lab.style.color = 'red';
var q4Answer = document.querySelector('input[name="q4"]:checked');
if (q4Answer && q4Answer.value === 'dive') {
score++;
}
lab = document.getElementById('q4-a1');
showAnswerDetail('q4-tail-detail');
lab.style.color = 'red';
lab = document.getElementById('q4-a2');
showAnswerDetail('q4-dive-detail');
lab.style.color = 'lightgreen';
lab = document.getElementById('q4-a3');
showAnswerDetail('q4-phishing-detail');
lab.style.color = 'red';
lab = document.getElementById('q4-a4');
showAnswerDetail('q4-none-detail');
lab.style.color = 'red';
// Display the result
var resultElement = document.getElementById('result');
resultElement.innerHTML = 'Your score is: ' + score + '/4';
}
function showAnswerDetail(detailId) {
var detailElement = document.getElementById(detailId);
if (detailElement) {
detailElement.style.display = 'block';
}
}
var labels = document.querySelectorAll('label');
labels.forEach(function (label) {
label.addEventListener('click', function () {
// Remove 'selected' class from all labels
labels.forEach(function (otherLabel) {
var radioLabel = label.closest('li.option'); // Assuming the radio is wrapped in an
with class "option"
var radioName = radioLabel
.querySelector('input[type="radio"]')
.getAttribute('name');
var otherRadioLabel = otherLabel.closest('li.option'); // Assuming the radio is wrapped in an
with class "option"
var otherRadioName = otherRadioLabel
.querySelector('input[type="radio"]')
.getAttribute('name');
if (otherRadioName === radioName) {
otherLabel.classList.remove('selected');
}
});
// Add 'selected' class to the clicked label
label.classList.add('selected');
});
});